import React from 'react';
import ReactDOM from 'react-dom';
import store from './store'
import { Provider, connect } from 'react-redux'
import Child from './components/child'
/* 
Provider 只在根组件使用一次即可 主要是为了  后代组件能够直接使用 store
connect 哪个组件想使用store中的数据源 哪个组件就是用connect处理

*/

class App extends React.Component {

    render() {
        console.log(this.props)
        let { count, minus, dispatch } = this.props;
        return <div className=''>
            <h1>{count}</h1>
            <button onClick={() => dispatch({ type: 'add', n: 100 })}>+</button>
            <button onClick={minus}>-</button>
            <Child />
        </div>;
    }
}
App = connect((state) => {
    //这个state就是 我们通过 getState 获取到的哪个state
    // console.log(state)
    return {
        count: state.count
    }
}, (dispatch) => {
    // 就是store提供的哪个dispatch
    return {
        dispatch,
        minus() {
            dispatch({ type: 'minus', m: 50 })
        }
    }
})(App)

ReactDOM.render(<Provider store={store}>
    <App />
</Provider>, document.getElementById('root'))